<div class="wrap">
	<div class="header-logo">
		<img src="img/static/shallife-logo.png" />
	</div>
	<div class="header-nav">
		<ul>
			<li>
				<a href="index.html">首页</a>
			</li>
			<li>
				<a href="strategy.html">攻略</a>
			</li>
			<li>
				<a href="case.html">案例</a>
			</li>
			<li>
				<a href="report.html">报道</a>
			</li>
			<li>
				<a href="ours.html">我们</a>
			</li>
		</ul>
		<div class="triangle-wrap">
			<div class="triangle">
			</div>
		</div>
	</div>
</div>
<script type="text/javascript">
	var sHref = window.location.href;
	var alocat =["index","strategy","case","report","ours"];
	for(var i=0;i<alocat.length;i++){
		if(sHref.indexOf(alocat[i])>=0)
		 $(".header-nav li").eq(i).addClass("active");
		 hh()
	}
	/*导航特效*/
	$(".header-nav>ul").mousemove(function(event){
		var ulWidth = $(this).width();
		var ulLeft  =  event.pageX -$(this).offset().left;
	    var finleft =0;
	    if(ulLeft<ulWidth*0.2)
	       finleft =9;	
	    else if(ulLeft<ulWidth*0.4) 
	    	finleft = 29;	
	    else if(ulLeft<ulWidth*0.6) 
	    	finleft = 49;	
	     else if(ulLeft<ulWidth*0.8) 
	    	finleft = 69;	
	     else //(ulLeft<ulWidth) 
	    	finleft = 89;	
	    $(".triangle").css({
	    	"margin-left":(finleft-(5/ulWidth*100))+"%"
	    });
	})
	$(".header-nav>ul").mouseleave(hh)
	function hh()
	{
		var ulWidth = $(this).width();
		for(var i=0;i<alocat.length;i++){
			if(sHref.indexOf(alocat[i])>=0){
				var a=[9,29,49,69,89]
				$(".triangle").css({
			    	"margin-left":(a[i]-(5/ulWidth*100))+"%"
			    });
				break;
			}
		}
	}
	/*添加新年专题css样式*/
	if($(window).width()>960)
	{
		var yearCss=$('<link rel="stylesheet" type="text/css" href="css/year.css"/>');
		$("head").append(yearCss);
	}
</script>
				